import React, { Component } from 'react';
import * as echarts from 'echarts';
import '../../../../assets/styles/tongji.css'
import req from '../../../../http/req'
import url from '../../../../config/url'
class Bingyu extends Component {
    state = {
        aa: []
    }
    render() {
        // setTimeout(() => {
            var chartDom = document.getElementById('tongji');
            if(chartDom){
            var myChart = echarts.init(chartDom);
            var option;
            req.get(url.GetStatData).then((res) => {
                // console.log(res.data.data.gender)
                    this.setState({
                        aa: res.data.data.gender  
                })

            })
            option = {
                title: {
                    text: '数据统计表',
                    subtext: 'Temperature table',
                    left: 'center'
                },
                tooltip: {
                    trigger: 'item'
                },
                legend: {
                    orient: 'vertical',
                    left: 'left'
                },
                series: [
                    {
                        name: 'Access From',
                        type: 'pie',
                        radius: '50%',
                        data: this.state.aa,
                        emphasis: {
                            itemStyle: {
                                shadowBlur: 10,
                                shadowOffsetX: 0,
                                shadowColor: 'rgba(0, 0, 0, 0.5)'
                            }
                        }
                    }
                ]
            };
        
            option && myChart.setOption(option);
        }
    // })


        return (
            <div id='tongji'>

            </div>

        );
    }

}

export default Bingyu;
